<template>
  <div class="main-list">
    <div class="weui-search-bar fajianren-searceh">
      <i
        class="weui-icon-search"
        style="width: 5%" @click="search"
      ></i>
      <input
        type="search"
        class="weui-search-bar__input postman-search"
        id="searchInput"
        :placeholder="holderText"
        required=""
        v-model="searchText"
      >
    </div>
    <radio-group @change="setDefault">
    <div class="fajianren" v-for="(addr,index) in addrList" @click="selectren(addr)">
      <div class="block-text">
        <div class="info">
          <span class="name">{{addr.contact ? addr.contact : ''}}</span>
          <div class="name" v-if="addr.defaultFlag == '1' && type == 1"><span class="moren">默认地址</span></div>
          <span class="dianhua">{{ addr.phone ? addr.phone : ''}}</span>
          <span class="dianhua">{{ addr.mobile ? addr.mobile : '' }}</span>
        </div>
        <div class="addr">
          {{ addr.fullAddress ? addr.fullAddress : ''}}
        </div>
      </div>
      <div class="block-btn">
        <div class="radio-class" >
          <input v-if="type == 1"
            type="radio"
            class="checkbox"
            name="defaultRadio"
            :value="addr.id"
            :checked="addr.defaultFlag == '1'"
          />
          <span v-if="type == 1">设为默认</span>
        </div>
        <a @click.stop="edit(addr)">编辑</a>
        <a @click.stop="del(addr.id)">删除</a>
      </div>
    </div>
    </radio-group>
    <!-- 没有更多数据 -->
    <div class="no-data">亲，没有更多了～</div>
    <div
      class="foot"
      @click="add"
    >新增地址
    </div>
    <tanchuan
      ref="tanchuanDel"
      :title="title"
      :content="content"
      @doCancle="doCancleDel"
      @doConfirm="doConfirmDel"
    ></tanchuan>
    <toast ref="toast"/>
  </div>
</template>

<script>
    import tanchuan from "@/components/tanchuan";
    import toast from "@/components/toast";
    import api from '@/utils/api'

    export default {
        components: {tanchuan, toast},

        data() {
            return {
                holderText : '',
                searchText : '',
                type: 1, // 1 发件人，0 收件人
                title: "确定删除",
                content: "确定删除此发件人？",
                addrList: [],
                currentId : "",
                pageNo: 1,
                pageSize: 100,
                backflag : ''
            };
        },
        onShow : function(){
            this.init();
            this.loadRen();
        },
        onLoad: function (options) {
            this.init();
            this.type = options.type;
            if(options.backflag){
                this.backflag = options.backflag
            }else{
                this.backflag = '';
            }
            if (this.type && this.type == 1) {
                wx.setNavigationBarTitle({
                    title: "发件人"
                });
                this.holderText = "发件人";
            } else if (this.type && this.type == 0) {
                wx.setNavigationBarTitle({
                    title: "收件人"
                });
                this.holderText = "收件人";
            }
        },

        onReachBottom(){
            //this.pageNo ++;
            console.log("上拉了");
            //this.loadRen();
        },

        created() {
        },

        methods: {
            selectren(addr){
              if(this.backflag == 1){
                  if(this.type == 1){
                      wx.setStorageSync("fajianaddr", addr);
                  }else{
                      wx.setStorageSync("shoujianaddr", addr);
                  }
                  //var url = "/pages/addhandsheet/main";
                  //mpvue.navigateTo({ url });
                  wx.navigateBack({
                      delta: 1
                  })
              }
            },

            init(){
                this.searchText = '';
                this.addrList = '';
                this.currentId = '';
                this.pageNo = 1;
                this.addrList = [];
            },


            search(){
                this.pageNo = 1;
                this.loadRen();
            },
            loadRen() {
                var _this = this;
                this.addrList = [];
                console.log("加载发件人，页码：" + this.pageNo);
                wx.request({
                    url: wx.getStorageSync("otherPath") + api.addrList + "?ecstoken=" + wx.getStorageSync('sessionId'),
                    method: "POST",
                    header: {
                        'Content-Type': 'application/x-www-form-urlencoded',
                        ecstoken : wx.getStorageSync('sessionId'),
                        fslb : wx.getStorageSync('fslb')
                    },
                    data: {
                        addressType: _this.type,
                        searchValue : _this.searchText,
                        pageNo: _this.pageNo,
                        pageSize: _this.pageSize
                    },
                    success(res) {
                        if(res.data.code != 200){
                            _this.$refs.toast.show(res.data.msg);
                            return ;
                        }
                        if(res.data.data.data || res.data.data.data.length > 0){
                            for(var i = 0; i < res.data.data.data.length ; i ++){
                                _this.addrList.push(res.data.data.data[i]);
                            }
                        }
                    },
                    fail() {
                        _this.$refs.toast.show('网络异常')
                    },
                })
            },
            setDefault(e){
                var value = e.mp.detail.value;
                var _this = this;
                wx.request({
                    url: wx.getStorageSync("otherPath") + api.setDefaultAddress + "?ecstoken=" + wx.getStorageSync('sessionId'),
                    method: "POST",
                    header: {
                        'Content-Type': 'application/x-www-form-urlencoded',
                        ecstoken : wx.getStorageSync('sessionId'),
                        fslb : wx.getStorageSync('fslb')
                    },
                    data: {
                        id: value,
                    },
                    success(res) {
                        if(res.data.code != 200){
                            _this.$refs.toast.show(res.data.msg);
                            return ;
                        }
                        _this.$refs.toast.show('设置成功')
                        _this.loadRen();
                    },
                    fail() {
                        _this.$refs.toast.show('网络异常')
                    },
                })
            },

            del(id) {
                this.currentId = id;
                this.$refs.tanchuanDel.show();
            },
            doCancleDel() {
                this.$refs.tanchuanDel.hidden();
                this.$refs.toast.show("取消删除");
                this.currentId = '';
            },
            doConfirmDel() {
                var _this = this;
                wx.request({
                    url: wx.getStorageSync("otherPath") + api.addrDel + "?ecstoken=" + wx.getStorageSync('sessionId'),
                    method: "POST",
                    header: {
                        'Content-Type': 'application/x-www-form-urlencoded',
                        ecstoken : wx.getStorageSync('sessionId'),
                        fslb : wx.getStorageSync('fslb')
                    },
                    data: {
                        id: [_this.currentId],
                        addressType: _this.type,
                    },
                    success(res) {
                        if(res.data.code != 200){
                            _this.$refs.toast.show(res.data.msg);
                            return ;
                        }
                        _this.$refs.toast.show('删除成功')
                        _this.loadRen();
                    },
                    fail() {
                        _this.$refs.toast.show('网络异常')
                    },
                    complete(){
                        _this.$refs.tanchuanDel.hidden();
                    }
                })
            },
            edit(addr) {
                var addrStr = JSON.stringify(addr)
                var url = "../addren/main?addr=" + encodeURIComponent(addrStr) + "&type=" + this.type;
                mpvue.navigateTo({url});
            },
            add() {
                var url = "../addren/main?type=" + this.type;
                mpvue.navigateTo({url});
            }
        }
    };
</script>
<style scoped>
  .postman-search {
    width: 95%;
    height: 0.5rem;
    line-height: 0.5rem;
  }

  .fajianren-searceh {
    margin-left: 5%;
    margin-top: 10px;
    width: 90%;
    height: 25px;
    box-shadow: 0px 1px 6px 0px rgba(0, 119, 255, 0.16);
    border-radius: 25px;
    background-color: #ffffff;
  }

  .fajianren-searceh input {
    margin-left: 5px;
    font-size: 11px;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(163, 170, 183, 1);
    line-height: 25px;
  }

  /* 发件人block */
  .fajianren {
    box-sizing: border-box;
    width: 100%;
    margin-top: 10px;
    padding: 0 0.3rem;
    background-color: #ffffff;
    height: 100px;
    box-shadow: 0px 2px 4px 0px rgba(7, 127, 255, 0.1);
  }

  .block-text {
    width: 100%;
    height: 1.2rem;
    border-bottom: 1px solid #e8eaf0;
  }

  .block-text .info {
    padding-top: 5px;
    height: 0.6rem;
    font-size: 0.26rem;
    font-family: PingFang-SC-Medium;
    font-weight: 500;
    color: #373e4f;
    line-height: 0.6rem;
  }

  .info .name {
    float: left;
    margin-right: 10px;
  }

  .info .moren {
    display: inline-block;
    color: #ff5454;
    height: 0.36rem;
    padding-left: 8px;
    padding-right: 8px;
    line-height: 0.36rem;
    font-size: 11px;
    border: 1px solid rgba(255, 84, 84, 1);
    border-radius: 0.18rem;
  }

  .info .dianhua {
    float: right;
    margin-left: 10px;
  }

  .addr {
    float: left;
    width: 100%;
    height: 20px;
    font-size: 12px;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(118, 125, 143, 1);
    line-height: 20px;
    text-align: left;
    /* border-bottom: 1px solid rgba(7, 127, 255, 0.1); */
  }

  .radio-class {
    width: 80%;
    height: 40px;
    line-height: 40px;
    font-size: 12px;
    color: #767d8f;
    font-family: PingFang SC;
    font-weight: 500;
  }

  .radio-class radio .wx-radio-input.wx-radio-input-checked {
    background-color: rgba(0, 119, 255, 1);
  }

  .block-btn {
    height: 40px;
    line-height: 40px;
    display: flex;
  }

  .block-btn a {
    display: inline-block;
    width: 10%;
    height: 40px;
    float: right;
    text-align: right;
    font-size: 12px;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(0, 119, 255, 1);
    margin-left: 8px;
  }

  .checkbox {
    transform: scale(0.5);
    float: left;
    margin-left: -0.12rem;
  }

  .no-data {
    color: #a3aab7;
    width: 2rem;
    height: 0.3rem;
    margin: 0 auto;
    margin-top: 0.3rem;
    text-align: center;
    font-size: 0.24rem;
    line-height: 0.26rem;
  }

  .foot {
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: 40px;
    position: fixed;
    bottom: 0;
    background-color: #0077ff;
    font-size: 15px;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(255, 255, 255, 1);
    line-height: 40px;
  }

  .fenge {
    margin-top: 10px;
    text-align: center;
    width: 100%;
    height: 12px;
    font-size: 12px;
    font-family: PingFang SC;
    font-weight: 500;
    color: rgba(163, 170, 183, 1);
    line-height: 12px;
  }
</style>
<style lang="wxss">
  page {
    width: 100%;
    height: 100%;
    background-color: #f7fbff;
  }
</style>
